<template>
	<!-- 资讯详情 -->
	<view class="s-y-s">
		<view class="u-font-40 m-font-b m-c-b u-p-30">{{ Newdetail.title }}</view>
		<!-- 来源：内当家说房 -->
		<view class="u-flex u-flex-between u-flex-items-center u-p-30">
			<view class="u-flex u-flex-items-center">
				<u--image width="30" height="30" :src="Newdetail.logo ? Newdetail.logo : logo" shape="circle"></u--image>
				<view class="u-font-26 m-c-9 u-m-l-20">来源：{{ Newdetail.author ? Newdetail.author : company }}</view>
			</view>
			<view :class="Newdetail.isGuanzhu === 1 ? 'weiguan' : 'xiazai'" @click="guanzhuClick">{{ Newdetail.isGuanzhu === 1 ? '已关注' : '+ 关注' }}</view>
		</view>

		<view v-if="type === 'text'" class="u-p-30 u-font-28 m-c-h e-p-h">
			<view class="u-content"><u-parse :content="Newdetail.content"></u-parse></view>
		</view>
		<!-- #ifndef APP-PLUS -->
		<video class="video" v-else :autoplay="true" :src="Newdetail.video_file"></video>
		<!-- #endif -->
		<!-- 商品评论 -->
		<view class="u-p-30 m-card elementTop">
			<view class="u-flex u-flex-between" @click="nextNav('')"><view class="u-font-32 m-font-b">资讯评论</view></view>
			<!-- 热门评论 -->
			<view class="" v-if="pinglunList.length">
				<view class="u-m-t-30 u-p-b-20 u-border-bottom" v-for="(item, index) in pinglunList" :key="index">
					<view class="u-flex">
						<u-image class="u-m-r-10" width="75rpx" height="75rpx" shape="circle" :src="item.avatar || df" />
						<view class="u-m-l-10">
							<view class="u-flex">{{ item.nickname }}</view>
							<view class="u-flex m-c-h u-font-26">{{ $u.timeFormat(item.createtime) }}</view>
						</view>
					</view>
					<view class="u-line-2 u-m-t-20 spac">{{ item.content }}</view>
				</view>
			</view>
			<list-empty v-else text="暂时没有数据哟!" list="data"></list-empty>
		</view>
		<view class="height-120"></view>
		<view class="m-eset u-flex u-flex-between u-flex-items-center">
			<view class="u-flex-8 u-p-l-30 u-p-r-30"><u-input placeholder="我来说几句..." confirmType="send" v-model="msgInput.msg1" @confirm="doSearch"></u-input></view>
			<view class="u-flex u-flex-4 u-flex-between u-flex-items-center m-c-h u-font-20 u-p-r-30">
				<view class="m-text-center" @click="dianzanClick">
					<u-icon name="thumb-up" :color="Newdetail.isDianzan === 0 ? '#979797' : '#003900'" size="28"></u-icon>
					<view class="u-m-l-10" :class="Newdetail.isDianzan === 0 ? '' : 'lvse'">点赞</view>
				</view>
				<view class="m-text-center" @click="toPinglun">
					<u-icon name="chat" color="#979797" size="28"></u-icon>
					<view class="u-m-l-10">评论</view>
				</view>
				<view class="m-text-center u-rela" @click="isMini() ? '' : shareClick()">
					<u-icon name="share-square" color="#979797" size="26"></u-icon>
					<view class="u-m-l-10">转发</view>
					<!-- #ifndef APP-PLUS -->
					<button open-type="share" class="share-btn"></button>
					<!-- #endif -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			guanzhu: false,
			Newdetail: {},
			value: '',
			pinglunList: [],
			type: 'text',
			msgInput: {
				msg1: ''
			},
			id: '',
			givethe: false
		};
	},
	async onLoad(e) {
		if (e) {
			if (e.id) {
				this.id = e.id;
				await this.getObj();
				await this.getComment();
				this.sumHeigly('.elementTop', 'top');
			} else {
				this.nextNav('back');
			}
			if (e.type) {
				this.type = e.type;
			}
		} else {
			this.nextNav('back');
		}
	},
	methods: {
		toPinglun() {
			uni.pageScrollTo({
				scrollTop: this.elementTop,
				duration: 300
			});
		},
		async getObj() {
			//资讯详情
			let res = await this.require('getNewdetail', {
				id: this.id
			});
			if (res) {
				this.Newdetail = res;
				// uni.setNavigationBarTitle({
				// 	title: res.title
				// })
			}
		},

		async getComment() {
			//评论列表
			let res = await this.require('getNewscomment', {
				p: 1,
				pnum: this.pnum,
				id: this.id
			});
			if (res) {
				this.pinglunList = res;
			}
		},
		async guanzhuClick() {
			//关注
			let res = await this.require('getFollow', {
				id: this.id,
				type: this.Newdetail.isGuanzhu
			});
			if (res) {
				await this.getObj();
			}
		},
		async dianzanClick() {
			//点赞
			let res = await this.require('getIszan', {
				id: this.id,
				type: this.Newdetail.isDianzan
			});
			if (res) {
				await this.getObj();
			}
		},
		async doSearch(content) {
			//添加评论
			this.msgInput.msg1 = '';
			let res = await this.require('getAddnews', {
				id: this.id,
				content
			});
			if (res) {
				await this.getComment(this.id);
			}
		},
		shareClick() {
			// #ifdef APP-PLUS
			uni.share({
				provider: 'weixin',
				scene: 'WXSceneSession',
				type: 0,
				title: this.Newdetail.title,
				imageUrl: this.logo,
				href: '/pages/zixun/xiangQing?id=' + this.Newdetail.id,
				success: function(res) {},
				fail: function(err) {}
			});
			// #endif
		}
	}
};
</script>

<style lang="scss" scoped>
.list {
	height: calc(100vh - (150rpx));
	background-color: #fff;
}

.s-y-s {
	width: 100%;
	min-height: 100vh;
	background: #fff;
}

.xiazai {
	width: 150rpx;
	height: 55rpx;
	line-height: 51rpx;
	border: 2rpx solid #dbb07b;
	border-radius: 45rpx;
	font-size: 28rpx;
	font-weight: bold;
	color: #dbb07b;
	text-align: center;
}

.weiguan {
	width: 170rpx;
	height: 55rpx;
	line-height: 51rpx;
	border: 2rpx solid #c0c0c0;
	border-radius: 45rpx;
	font-size: 28rpx;
	font-weight: bold;
	color: #c0c0c0;
	text-align: center;
}

.e-p-h {
	text-indent: 50rpx;
}

.m-flex {
	width: 500rpx;
	margin: auto !important;
}

.m-eset {
	width: 100%;
	height: 120rpx;
	position: fixed;
	bottom: 0;
	left: 0;
	border-top: 5rpx solid #f1f1f1;
	background-color: #fff;
	z-index: 9999;
}

.m-inp {
	width: 386rpx;
	height: 60rpx;
	border: 1rpx solid #c0c0c0;
	border-radius: 10rpx;
}

.textarea {
	height: 60rpx;
	line-height: 60rpx;
	margin-left: 15rpx;
}

.lvse {
	color: #003900;
}
</style>
